/**
 * Created by tdzl2003 on 12/18/16.
 */

import React, {Component} from "react";
import {Image, NativeModules, StyleSheet, Text, TouchableOpacity, View, Platform,DeviceEventEmitter} from "react-native";
import SuggestList from "./components/SuggestList";
import SuggestFindRequest from "../contract/suggest/request/SuggestFindRequest";
import suggestHandle from "./suggestHandle";
import suggestDetail from "./suggestDetail";
import CommStatusBar from './components/CommStatusBar';

import RString from '../language/RString';
import RConfig from '../language/RConfig';

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: 'white'
    },
    commonHeader: {
        height: Platform.OS === 'android'? 50 : 60,
        paddingTop: Platform.OS === 'ios'? 20 : 0,
        backgroundColor: '#333238',
        flexDirection: 'row',
        justifyContent: 'center',
        position: 'relative'
    },
    back: {
        width:30,
        position: 'absolute',
        left: 20,
        top: 0,
        height: Platform.OS === 'android'? 50 : 60,
        paddingTop: Platform.OS === 'ios'? 20 : 0,
        justifyContent: 'center'
    },
    languageBox:{
        width:35,
        justifyContent:'center',
        height:35,
        display:'flex',
        alignItems:'center',
        backgroundColor:'#3499ff',
        borderRadius:35,
        position:'absolute',
        bottom:40,
        right:30
    },
    language:{
        fontSize:14,
        color:'#fff',
        fontWeight:'bold'
    }
});


export default class CoordinationList extends Component {
    constructor(props) {
        super(props);
        let request = new SuggestFindRequest();
        request.setPageSize(0);
        this.state = {
            request: request,
            AorB:true,//代表当前显示是中文，按钮显示EN
        }
    }

    componentWillMount(){
        if(RConfig.language=="zh"){
            this.setState({
                AorB:true
            });
        }else {
            this.setState({
                AorB:false
            });
        }
    }

    doClose = () => {
        NativeModules.system.navTo("BACK");
    };

    click = (item) => {
        const {navigator} = this.props;
        if (item.status == 'TO_ACCEPT' || item.status == 'REOPEN') {
            navigator.push({name: "suggestHandle", component: suggestHandle, params:{id: item.id}});
        } else {
            navigator.push({name: "suggestDetail", component: suggestDetail, params:{id:  item.id}});
        }
    };

    changeLanguage(){
        if(RConfig.language=="zh"){
            RConfig.language="en";
            this.setState({
                AorB:false
            });
        }else {
            RConfig.language="zh";
            this.setState({
                AorB:true
            });
        }
        DeviceEventEmitter.emit("language",RConfig.language);
    };

    render() {
        return (
            <View style={styles.container}>
                <CommStatusBar />
                <View style={styles.commonHeader}>
                    <TouchableOpacity onPress={this.doClose.bind(this)} style={styles.back}>
                        <Image source={require('./img/chahao.png')}/>
                    </TouchableOpacity>
                    <View style={{justifyContent: 'center'}}>
                        <Text style={{color: '#fff', fontSize: 16}}>{RString('suggestHome')}</Text>
                    </View>
                </View>
                <SuggestList request={this.state.request} onClick={this.click}></SuggestList>
                <TouchableOpacity style={styles.languageBox} onPress={this.changeLanguage.bind(this)}>
                    {this.state.AorB && <Text style={styles.language}>EN</Text>}
                    {!this.state.AorB && <Text style={styles.language}>中</Text>}
                </TouchableOpacity>
            </View>
        );
    }
}
